import React, { Component } from 'react'
// 1.jsx可以当做参数传递
export class Test extends Component {
  render() {
    return (
      <>
        <div>父组件</div>
        <hr />
        <TestSon>
          <div>111</div>
          <div>222</div>
        </TestSon>
        <hr />
        <TestSon2 topSlot={<div>111</div>} bottomSlot={<div>222</div>} />
      </>
    )
  }
}
export class TestSon extends Component {
  render() {
    console.log(this.props.children)
    return (
      <>
        {this.props.children[0]}
        <div>子组件1</div>
        {this.props.children[1]}
      </>
    )
  }
}

export class TestSon2 extends Component {
  render() {
    return (
      <>
        {this.props.topSlot}
        <div>子组件2</div>
        {this.props.bottomSlot}
      </>
    )
  }
}
